1.可以访问到要控制的元素
document.getElementById("is属性值");设置DOM对象
document.getElementsByTagName("标签名");DOM对象集合，实现
cocument.getElementsByClassNAme("class属性值");集合

node.parentNode(DOM对象)       node.children(DOM对象集合)
node.firstElementChild    node.lastElementChild
node.nextElementSibling   node.previousElementSiling


2.考虑给合适的元素绑定事件
只能给DOM节点对象绑定事件
node.onclick = function() {}
node.onmouseover = function() {}
node.onfocus = function() {}
node.onblur = function() {}
node.onmouseout = function() {}

3.在事件的回调函数中，实际的完成操作过程
元素的标签中内容的操作   node.innerHTML    node.innerText
元素标签上属性的操作
node.getAttribute("属性名")
node.setAttribute("属性名","属性值")
node.hasAttribute("属性值") 返回值是true/false
node.removeAttribute("属性名")移除特定属性

4.网页元素的增加、修改、删除
document.createElement("标签名");
document.insertBefore(new.old);
document.appendChild(child);
document.replaceChild(new,old);
document.removeChild(child);